<template>
	<view class="article">
		<!--标题-->
		<view class="article-title">{{ content.articleTitle}}</view>
		
		<!--简介-->
		<view class="article-intr"> {{ content.introduction || '' }}</view>
		
		<!--内容-->
		<u-parse class="article-content" :content="content.content"></u-parse>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				articleId: '',
				content: {}
			};
		},
		onLoad(option) {
			uni.showLoading({
			  title: '加载中...'
			})
			this.articleId = option.articleId
			if (this.articleId) {
				this.getDetail(this.articleId)
			}
		},
		methods: {
			async getDetail(id) {
				const res = await this.$request({
					method: 'GET',
					url: `/marketing-center/ad/article/${id}`,
				})
				this.content = res.datas
				uni.hideLoading()
			}
		}
	}
</script>

<style lang="scss" scoped>
.article {
	width: 100%;
	height: auto;
	overflow-y: auto;
	padding: 20rpx;
	box-sizing: border-box;
	
	&-title {
		text-align: center;
		font-weight: bold;
	}
	
	&-intr {
		font-size: 24rpx;
		color: rgba(#000000,.4);
		padding: 20rpx 0;
	}
	&-content {
		word-break: break-all;
		/deep/ image {
		  width: 100%;
		}
	}
}
</style>
